<template>
  <div style="padding: 20px;text-align: center;">{{ form.isMaterial == 'M' ? '原料' : '盘头' }}</div>
  <van-form disabled v-if="form.isMaterial == 'M'">
     <van-field v-model="form.locationCode" name="user" label="库位号" placeholder="库位号"
      :rules="[{ required: true, message: '库位号' }]" />
    <van-field v-model="form.batch" name="user" label="纱线批号" placeholder="请填写纱线批号"
      :rules="[{ required: true, message: '请填写' }]" />
    <van-field disabled v-model="form.materialNo" name="user" label="物料编码" placeholder="请填写物料编码"
      :rules="[{ required: true, message: '请填写' }]" />
    <van-field disabled v-model="form.materialDescribe" name="user" label="物料描述" placeholder="物料描述"
      :rules="[{ required: true, message: '请填写' }]" />
    <van-field disabled v-model="form.relaNum" name="user" label="关联号" placeholder="物料描述"
      :rules="[{ required: true, message: '请填写' }]" />
    <van-field disabled v-model="form.pickDate" name="user" label="拣选日期" placeholder="拣选日期"
      :rules="[{ required: true, message: '请填写' }]" />
    <van-field disabled v-model="form.grainWgt" name="grainWgt" label="粒重" placeholder="请填写粒重"
      :rules="[{ required: true, message: '粒重' }]" />
          <van-field v-model="form.silkNum" name="silkNum" label="粒数" placeholder="请填写粒数"
      :rules="[{ required: true, message: '请填写粒数' }]" />
          <van-field v-model="form.customerNameCustomerNo" name="customerNameCustomerNo" label="客户信息" placeholder="客户信息"
      :rules="[{ required: true, message: '客户信息' }]" />
      <van-field v-model="form.groupNo" name="groupNo" label="组号" placeholder="组号"
      :rules="[{ required: true, message: '组号' }]" />
       <van-field v-model="form.sourceType" name="sourceType" label="数据来源" placeholder="数据来源"
      :rules="[{ required: true, message: '数据来源' }]" />
    <van-field disabled name="isSelected" label="是否精选">
      <template #input>
        <van-radio-group disabled v-model="form.isSelected" direction="horizontal">
          <van-radio v-for="dict in dictOpts.selectOpts" :key="dict.dictValue" :name="dict.dictValue">{{ dict.dictLabel
            }}</van-radio>
        </van-radio-group>
      </template>
    </van-field>

    <van-field v-if="form.isSelected === '2'" name="isSelected" label="红蓝箱"
      :rules="[{ required: form.isSelected === '2', message: '请选择红蓝箱' }]">
      <template #input>
        <van-radio-group v-model="form.isSelecteds" direction="horizontal">
          <van-radio v-for="dict in dictOpts.redBlueOpts" :key="dict.dictValue" :name="dict.dictValue">{{ dict.dictLabel
            }}</van-radio>
        </van-radio-group>
      </template>
    </van-field>



  </van-form>
   <van-form disabled v-else>
       <van-field v-model="form.locationCode" name="user" label="库位号" placeholder="库位号"
      :rules="[{ required: true, message: '库位号' }]" />
       <van-field v-model="form.panHeadPlace" name="panHeadPlace" label="盘头排序号" placeholder="盘头排序号"
      :rules="[{ required: true, message: '盘头排序号' }]" />
       <van-field v-model="form.panHeadNo" name="panHeadNo" label="盘头号" placeholder="盘头号"
      :rules="[{ required: true, message: '盘头号' }]" />
      <van-field v-model="form.panHeadSpecs" name="panHeadSpecs" label="盘头规格" placeholder="盘头规格"
      :rules="[{ required: true, message: '盘头规格' }]" />
      <van-field v-model="form.panHeadStatus" name="panHeadStatus" label="盘头状态" placeholder="盘头状态"
      :rules="[{ required: true, message: '盘头状态' }]" />
      <van-field v-model="form.panHeadNum" name="panHeadNum" label="盘头数量" placeholder="盘头数量"
      :rules="[{ required: true, message: '盘头数量' }]" />
      <van-field v-model="form.customerNameCustomerNo" name="customerNameCustomerNo" label="客户信息" placeholder="客户信息"
      :rules="[{ required: true, message: '客户信息' }]" />
      <van-field v-model="form.warpingRecordNo" name="warpingRecordNo" label="整经记录表号" placeholder="整经记录表号"
      :rules="[{ required: true, message: '整经记录表号' }]" />
      
   </van-form>
      <van-button v-if="isSpecify" style="position: fixed;width: 100%;bottom: 0;" block type="primary"
      native-type="submit">
      提交
    </van-button>
    <van-button @click="gotoBack" v-else style="position: fixed;width: 100%;bottom: 0;" block type="primary"
      native-type="submit">
      关闭
    </van-button>
</template>

<script setup>
import { computed, onBeforeMount, onMounted, reactive, ref } from 'vue'
import { getDict } from '@/api/common'
import { useRouter } from 'vue-router';
import useStore from '@/store/index'
import { getWmsLocationRelat } from '../../api/pda';
import { getInfo } from '../../api/login';
const { usePDAStore } = useStore();
const router = useRouter();
const showPicker = ref(false)
const form = ref({})
const isSpecify = ref(false);
const dictOpts = reactive({
  selectOpts: [], //是否精选 字典项
  redBlueOpts: [],// 红蓝箱 字典项
  yesOrNoOpts: [],// 是、否 字典项
  floorOpts: [],// 楼层字典项
})
const formType = computed(() => {
  return TypeList.value.find(item => item.value === form.value.state)?.text || ''
})
const TypeList = ref([{
  text: '占用',
  value: '20',
  color: 'green'
}, {
  text: '锁定',
  value: '50',
  color: 'yellow'
}, {
  text: '空闲',
  value: '10',
  color: 'darkgray'
}, {
  text: '异常',
  value: '30',
  color: 'orange'
}, {
  texgt: '禁用',
  value: '40',
  color: 'red'
}
])
const gotoBack = () => {
  router.push(router.options.history.state.back)
}


onMounted(() => {

  getDicts('selected_flag', 'selectOpts')
  getDicts('red_blue_flag', 'redBlueOpts')
  getDicts('MES_YES_NO', 'yesOrNoOpts')
  getDicts('MES_FTY_FLOOR', 'floorOpts')
  getWmsLocationRelat({
    locationCode: usePDAStore.showForm.locationCode
  }).then(res => {
    form.value = {
      ...res.data,
      isMaterial: usePDAStore.showForm.isMaterial
    }
    console.log(res.data)
    console.log(usePDAStore.showForm)
  })
})

const onSubmit = () => {

}
const onConfirm = ({ selectedOptions }) => {
  showPicker.value = false;
  form.value.state = selectedOptions[0].value;
};

const getDicts = async (code, key) => {
  try {
    const { data } = await getDict(code);
    dictOpts[key] = data || []
  } catch (error) {
    console.log(error)
  }
}

</script>